﻿@model Olemas.ViewModels.AddViewModel

<script type="text/javascript" src="~/Scripts/Shared/jquery-ui-1.9.2.slider.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />


<div id="addBookDiv" class="addNewBookPanel">
    @using (Html.BeginForm("PostBook", "Add", FormMethod.Post, new { enctype = "multipart/form-data", name = "postBookForm", id = "postBookForm" }))
    {
        <div id="headingsDivAddBook" class="headingsDiv">
            @Html.Label("Pealkiri: ")
            @Html.Label("Autor: ")
            @Html.Label("Teaduskond: ")
            @Html.Label("Asukoht: ")
            @Html.Label("Hinnasoov: ")
            @Html.Label("Lisainfo: ")
        <br>
            @Html.Label("Pildid: ")
        </div>

        <div id="valuesDiv" class="valuesDivAdd">
            <div class="addValidation">
                @Html.ValidationMessageFor(x => x.BookModel.Name)
            </div>
            @Html.TextBoxFor(x => x.BookModel.Name, new { id = "bookNameTextBox", maxlength = "75" })
            <div class="addValidation">
                @Html.ValidationMessageFor(x => x.BookModel.Author)
            </div>
            @Html.TextBoxFor(x => x.BookModel.Author, new { id = "bookAuthorTextBox", maxlength = "100" })
            @Html.DropDownListFor(x => x.Faculties, new SelectList(Model.Faculties, "id", "name"))
            @Html.DropDownListFor(x => x.Cities, new SelectList(Model.Cities, "id", "name"))
            <input type="text" id="BookPrice" name="Price" style="width: 50px; float: left;" />
            <div id="slider-range-min" class="valuesDivAddSlider"></div>
            <textarea id="BookDescription" placeholder="Näiteks täpsustusi seisukorra kohta.." maxlength="400"></textarea>
        </div>
        <div class="imgUploadDiv">
            <input type="file" name="files" id="file1" accept="image/*" />
            <input type="file" name="files" id="file2" accept="image/*"  />
        </div>
        
        <hr />
        <p><b>Sinu kontaktandmed:</b></p>
        <div class="userContactDiv">
            <div class="headingsDiv">
                @Html.Label("Nimi: ")
                @Html.Label("Kontakttelefon: ")
                @Html.Label("Salasõna: ")
                @Html.Label("Email: ") 
            </div>
            <div class="valuesDivAdd">
                @Html.TextBoxFor(x => x.UserModel.Name, new { id = "UserName", maxlength = "75" })
                <div class="addValidation">
                    @Html.ValidationMessageFor(x => x.UserModel.Name)
                </div>
                @Html.TextBoxFor(x => x.UserModel.Phone, new { id = "UserPhone", maxlength = "20" })
                <div class="addValidation">
                    @Html.ValidationMessageFor(x => x.UserModel.Phone)
                </div>
                @Html.PasswordFor(x => x.UserModel.Password, new { id = "UserPassword", maxlength = "100" })
                <div class="addValidation">
                    @Html.ValidationMessageFor(x => x.UserModel.Password)
                </div>
                @Html.TextBoxFor(x => x.UserModel.Email, new { id = "UserEmail", maxlength = "40" })
                <div class="addValidation">
                    @Html.ValidationMessageFor(x => x.UserModel.Email)
                </div>
            </div>
        </div>
        <input type="submit" />
    }
    <div class="userContactTipsDiv">
            <label id="tip"></label>
        </div>
</div>


<script>
    $(function () {
        $("#slider-range-min").slider({
            range: "min",
            value: 1,
            min: 0,
            step: 0.5,
            max: 200,
            slide: function (event, ui) {
                $("#BookPrice").val("€ " + ui.value);
            }
        });
        $("#BookPrice").val("€ " + $("#slider-range-min").slider("value"));
        $("#BookPrice").attr("disabled", "disabled");

        $('#postBookForm').submit(function (e) {
            if (!$(this).valid()) {

            }
        });

        $("#UserPassword").focus(function () {
            $("#tip").text("Salasõna abil saad enda lisatud kuulutust muuta või kustutada.");
        });
        $("#UserEmail").focus(function () {
            $("#tip").text("Meilile saadetakse sinu valitud salasõna ja kuulutuse link.");
        });
        $("#UserEmail").blur(function () {
            $("#tip").text("");
        });
        $("#UserPassword").blur(function () {
            $("#tip").text("");
        });
    });
</script>
